<!-- 人事-基础设置 -->
<template>
  <div class="base-setting">
    <a-table
      :data="formData"
      :bordered="{
        wrapper: true,
        cell: true,
        headerCell: true,
        bodyCell: true
      }"
      stripe
      :pagination="false"
    >
      <template #columns>
        <a-table-column
          title="办理环节"
          data-index="node"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理事项"
          data-index="description"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理事项要求"
          data-index="stand"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理部门"
          data-index="department"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理人"
          data-index="person"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理人联系方式"
          data-index="phone"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="办理地点"
          data-index="space"
          :width="200"
        ></a-table-column>
        <a-table-column
          title="操作"
          dataIndex="operation"
          align="center"
          :width="200"
          fixed="right"
        >
          <template #cell="{ record, rowIndex }">
            <a-tooltip content="编辑">
              <icon-font
                @click="edit(record)"
                type="icon-edit"
                :size="26"
                :style="{
                  marginRight: '10px',
                  cursor: 'pointer'
                }"
              />
            </a-tooltip>
            <a-tooltip content="删除" position="left">
              <a-popconfirm
                content="是否确认删除该条数据?"
                position="left"
                @ok="del(record, rowIndex)"
              >
                <icon-font
                  type="icon-delete"
                  :size="26"
                  :style="{
                    cursor: 'pointer',
                    marginRight: '10px'
                  }"
                />
              </a-popconfirm>
            </a-tooltip>
          </template>
        </a-table-column>
      </template>
    </a-table>
  </div>
</template>

<script lang="ts" setup>
const formData = reactive([
  {
    node: '',
    space: '',
    department: '',
    person: '',
    phone: '',
    demands: [
      {
        demand: '',
        content: ''
      }
    ]
  }
]);
</script>

<style scoped lang="less"></style>
